﻿<!DOCTYPE html>
<html lang="cn" xmlns:th="http://www.thymeleaf.org">
<html lang="en">
<head>
<meta charset="utf-8">
<title>Spa Land - Body & Massage Therapy HTML Template | Login / Registration </title>

<!-- Stylesheets -->
<link href="/css/bootstrap.css" rel="stylesheet">
<link href="/css/style.css" rel="stylesheet">
<link href="/css/responsive.css" rel="stylesheet">

<!--Color Switcher Mockup-->
<link href="/css/color-switcher-design.css" rel="stylesheet">

<!--Color Themes-->
<link id="theme-color-file" href="/css/color-themes/default-theme.css" rel="stylesheet">

<!--Favicon-->
<link rel="shortcut icon" href="/images/favicon.png" type="image/x-icon">
<link rel="icon" href="/images/favicon.png" type="image/x-icon">

<!-- Responsive -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<!--[if lt IE 9]><script src="/https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script><![endif]-->
<!--[if lt IE 9]><script src="/js/respond.js"></script><![endif]-->
</head>

<body>
<div class="page-wrapper">
 	
    <!-- Preloader -->
    <div class="preloader"></div>

    <!-- Main Header-->
    <header class="main-header header-style-three">
    	
        <!--Header Top-->
    	<div class="header-top">
        	<div class="auto-container">
            	<div class="inner-container clearfix">
                    <div class="top-left">
                        <ul class="clearfix">
                            <li><a href="#"><i class="fa fa-volume-control-phone"></i> 15136609940</a></li>
                            <li><a href="#"><i class="fa fa-envelope-o"></i> 15136609940@163.com</a></li>
                        </ul>
                    </div>
                    <div class="top-right">
                        <div class="link-box"><a href="appointment.html">立刻预定</a></div>
                    </div>
                </div>
            </div>
        </div>
        <!-- End Header Top -->

        <!-- Header Lower -->
        <div class="header-lower">
            <div class="auto-container">
               <div th:insert="~{header :: #main-box}"></div>
            </div>
        </div>
        <!-- End Header Lower -->
        
        <!--Sticky Header-->
        <div th:insert="~{header :: #header-sticky}"></div>
        <!--End Sticky Header-->
    </header>
    <!--End Main Header -->
    
 	<!--Page Title-->
    <section class="page-title" style="background-image:url(images/background/13.jpg);">
        <div class="auto-container">
        	<div class="inner-container clearfix">
	            <h1>Registration</h1>
	            <ul class="bread-crumb clearfix">
	                <li><a href="index.html">首页</a></li>
	                <<!-- li><a href="">登录</a></li> -->
	            </ul>
        	</div>
        </div>
    </section>
    <!--End Page Title-->

    <!--Login Section-->
    <section class="login-section">
        <div class="auto-container">
            <div class="row clearfix">
                <div class="column col-md-6 col-sm-12 col-xs-12">
                    <!-- Login Form -->
                    <h2>登&nbsp;&nbsp;录</h2>
                    <div class="login-form">
                        <!--Login Form-->
                        <form method="post" onsubmit="return false">
                            <div class="form-group">
                                <label>请输入您的邮箱</label>
                                <input type="email" name="userEmail" id="userEmail" placeholder="Name or Email " required>
                            </div>
                            
                            <div class="form-group">
                                <label>请输入您的密码</label>
                                <input type="password" name="password" id="password" placeholder="Password" required>
                                <span id="pwdError"></span>
                            </div>
                            
                            <div class="clearfix">
                                <div class="pull-right">
                                    <div class="form-group text-right">
                                        <button class="theme-btn btn-style-four" onclick="submitUserInfo()" type="submit" name="submit-form">登录</button>
                                    </div>
                                </div>
                                <div class="pull-left">
                                    <div class="form-group remember">
                                        <input type="checkbox" name="shipping-option" id="account-option-2">&nbsp; <label for="account-option-2" style="display: inline-block;">记住我</label>
                                        <a href="#" class="psw">忘记密码?</a>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                    <!--End Login Form -->
                </div>

                <div class="column col-md-6 col-sm-12 col-xs-12">
                    <h2>注&nbsp;&nbsp;册</h2>
                    <!-- Login Form -->
                    <div class="login-form">
                        <!--Login Form-->
                        <form method="post" onsubmit="return false">
                            <div class="form-group">
                                <label>请输入您的邮箱地址</label>
                                <input type="email" name="userEmail" id="reg_user_email"  placeholder="Your Email " required>
                                <span id="error" style="color: red; display: none;"></span>
                            </div>
                            
                            <div class="form-group">
                                <label>请输入您的密码</label>
                                <input type="password" name="password" id="reg_user_pwd" placeholder="Password" required>
                                <span id="success" style="color: green; display: none;"></span>
                            </div>
                            
                            <div class="clearfix">
                                <div class="pull-right">
                                    <div class="form-group text-right">
                                        <button class="theme-btn btn-style-four" onclick="submitRegister()"  type="submit" name="submit-form">注册</button>
                                    </div>
                                </div>
                            </div>
                            
                            
                        </form>
                    </div>
                    <!--End Login Form -->
                </div>
            </div>
        </div>
    </section>
    <!--End Login  Section-->

    
    <!-- Main Footer -->
    <div th:insert="~{footer :: #footer}"></div>
    <!-- End Main Footer -->

</div>    
<!--End pagewrapper-->

<div class="color-palate">
    <div class="color-trigger">
        <i class="fa fa-gear"></i>
    </div>
    <div class="color-palate-head">
        <h6>选择一个你喜欢的主题</h6>
    </div>
    <div class="various-color clearfix">
        <div class="colors-list">
            <span class="palate default-color active" data-theme-file="/css/color-themes/default-theme.css"></span>
            <span class="palate teal-color" data-theme-file="/css/color-themes/teal-theme.css"></span>
            <span class="palate navy-color" data-theme-file="/css/color-themes/navy-theme.css"></span>
            <span class="palate yellow-color" data-theme-file="/css/color-themes/yellow-theme.css"></span>
            <span class="palate blue-color" data-theme-file="/css/color-themes/blue-theme.css"></span>
            <span class="palate purple-color" data-theme-file="/css/color-themes/purple-theme.css"></span>
            <span class="palate olive-color" data-theme-file="/css/color-themes/olive-theme.css"></span>
            <span class="palate red-color" data-theme-file="/css/color-themes/red-theme.css"></span>
        </div>
    </div>

    <div class="palate-foo">
        <span>你可以很简单的改变主体颜色</span>
    </div>

</div>
<!-- /.End Of Color Palate -->

<script src="/js/jquery.js"></script>
<script src="/js/bootstrap.min.js"></script>
<!--End Revolution Slider-->
<script src="/js/jquery-ui.js"></script>
<script src="/js/jquery.fancybox.js"></script>
<script src="/js/owl.js"></script>
<script src="/js/appear.js"></script>
<script src="/js/wow.js"></script>
<script src="/js/mixitup.js"></script>
<script src="/js/jquery.bootstrap-touchspin.js"></script>
<script src="/js/validate.js"></script>
<script src="/js/script.js"></script>
<!--Color Switcher-->
<script src="/js/color-settings.js"></script>
</body>
</html>
<script type="text/javascript">
    // 登录功能实现
    function submitUserInfo() {

        var email = $("#userEmail").val();
        // alert(email)
        var password = $("#password").val();
        // alert(password)
        $.ajax({
            url:'/user/login',
            type:'POST',
            dataType:'JSON',
            data:{
                email:email,
                password:password
            },
            success:function (result) {
                if (result.code == 200) {
                    console.log(result);
                    window.location.href = result.data;
                } else {
                    $("#pwdError").html(result.msg).show();
                }
            }
        })
    }
    // 注册功能实现
    function submitRegister() {
        alert(1234)
        var userEmail = $("#reg_user_email").val();
        // alert(userEmail);
        var password = $("#reg_user_pwd").val();
        // alert(password);

        $.ajax({
            url:'/user/register',
            type:'POST',
            dataType:'JSON',
            data:{
                email:userEmail,
                password:password
            },
            success:function (result) {
                if (result.code == 200) {
                    $("#error").html("");
                    $("#success").html(result.msg).show();
                } else {
                    $("#error").html(result.msg).show();
                    return false;
                }
            }
        })


    }
</script>
<script type="text/javascript">
    function searchService() {
        var question = $("#q").val().trim();
        window.location.href = '/gallery/searchGallery?question=' + question;
    }
</script>